//公告详情
<template>
  <view>
    <view :style="{ height:statusBarHeight+'px' }"></view>
    <view class="title_container">
      <image class="back_img" src="../../static/icon_back.png" @click="naviBack"></image>
      <view class="title">公告</view>
    </view>
    <view class="item">
      <view class="row_container" v-html="announceData">

      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app';


  //页面传参
  const queryData = defineProps<{ data : string }>()

  const statusBarHeight = ref(0)
  const announceData = ref<any>(null)



  onLoad(() => {
    const systemInfo : any = uni.getSystemInfoSync()
    statusBarHeight.value = systemInfo.statusBarHeight | 20
    console.log(statusBarHeight.value)
    console.log(decodeURIComponent(queryData.data))
    announceData.value = decodeURIComponent(queryData.data)

  })

  //自定义返回事件
  const naviBack = () => {
    console.log('back')
    uni.navigateBack()
  }
</script>

<style lang="scss">
  page {
    height: 100%;
    background: linear-gradient(180deg, #BAE2EA 0%, #F9FAFB 100%);
  }

  .title_container {
    height: 88rpx;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0rpx 15rpx;
    margin-bottom: 12rpx;
  }

  .title {
    flex-grow: 1;
    color: #1C253A;
    font-weight: 500;
    font-size: 32rpx;
    text-align: center;
  }

  .back {
    font-size: 30rpx;
  }

  .back_img {
    width: 40rpx;
    height: 40rpx;
  }



  .item {
    background-color: white;
    min-height: 40vh;
    border-radius: 16rpx;
    padding: 24rpx;
    color: #1C253A;
    margin-left: 30rpx;
    margin-right: 30rpx;
    margin-top: 20rpx;
    box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(209, 227, 230, 0.58);

  }

  .row_container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;

  }

  .row_container_bottom {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 50rpx;
  }
</style>
